
/**
 * 在需要的图表下方生成表格
 *
 * @author  yangjinlai 20200226
 * zhaoying 20200827 从人事管理h5迁移至理顾宝-资产配置
 */



function drawTable( id, dColor, echartsObj, headerData ){

	let echartsDom = id.getDom();

	let html = '<div class="tableBox"><div class="tableUnderChart"><table>';

	let color = echartsObj.color;

	//如果传参有headerData，这个数据是表格的表头
	if( headerData ){

		html += '<tr>';

		html += '<td class="header">' + headerData.name + '</td>';

		headerData.data.forEach( (i) =>{
			html += '<td class="value">'+i+'</td>'
		})

		html += '</tr>';
	}

	//循环serires
	echartsObj.series.forEach((item, index, arr) => {
		html += '<tr>';

		//因为echarts配置的颜色不能直接拿来用，所以需要css里针对echarts颜色的配置，特别对应上
		html += '<td class="header"><div class="headerWidth"><div class="tip '+echartsObj.echartsType + '_' + item.type + '_' + dColor+'_tip'+ (index+1) +'" style="background:"'+ echartsObj.color[index] +'></div><span class="label">'+item.name+'</span></div></td>'

		//接下来的元素 item.dw 如果带单位就把单位渲染拼接上,如果不带 就只渲染数据
		if(item.dw){
			item.data.forEach( (i) =>{
				html += '<td class="value">'+i+item.dw+'</td>'
			})
		}else{
			item.data.forEach( (i) =>{
				html += '<td class="value">'+i+'</td>'
			})
		}


		html += '</tr>';
	})

	html += '</table></div></div>'


	echartsDom.insertAdjacentHTML('afterEnd', html) ;
	// 循环计算表格的高度，为了解决ios 滚动出现滑动条问题
	var table = document.getElementsByTagName('table');
	for (var i=0;i<table.length;i++){
		var tHeight = table[i].offsetHeight;
		var tableBox = document.getElementsByClassName('tableBox')[i];
		var paddingH = 20;
		tableBox.style.height = tHeight+paddingH+'px';
	}
}

export default drawTable
